{extends file='layout/base.html'}

{block name='title'}Login - Intel Sales Advisor{/block}

{block name='headApend'}
<!-- CSS : implied media="all" -->
<link rel="stylesheet" href="styles/admin_style.css">
{/block}

{block name='body'}

<body class="login">
  <div id="container">
    <header class="ttl">
		Sales Advisor Content Management System
    </header>
    
    <div class="login_box">
      <form action="admin/login" method="post" accept-charset="utf-8">
			<ul>
				<li><input type="text" name="user_name" class="text_field" /> <input type="text" class="text_field" value="Username" style="color:#ccc;display:none"/></li>
				<li><input type="password" name="password" class="text_field" /> <input type="text" class="text_field" value="Password" style="color:#ccc;display:none"/></li>
				<li><input type="submit" value="" class="login_btn" /></li>
			</ul>
		</form>
    </div>
    
    <footer>

    </footer>
  </div>
</body>
<script type="text/javascript" charset="utf-8">
dialog_title = 'Login';

$('.login_box li input').each(function(){
  if ($(this).attr('type') != 'submit') {
    $(this).placeholder($(this).next());
  }
  // var clone = $(this).clone();
  // clone.removeAttr('name').val($(this).attr('placeholder'));
  // $(this).after(clone);
  // $(this).placeholder(clone);
});

  var user_name = $('input[name=user_name]');
  var password = $('input[name=password]');

  $('form').submit(function(){
    
    if (!user_name.val()) {
      show_msg('User Name Not Allow Empty!', function(){
        user_name.next().focus();
      });

      return false;
    }
    if (!password.val() ) {
      show_msg('User Password Not Allow Empty!', function(){
        password.next().focus();
      });

      return false;
    }
    
    return true;
  });

</script>
{/block}